<%@page import="net.zretc.entitys.Pet"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>宠物类型</title>

<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="./css/x-admin.css" media="all">
<link rel="stylesheet" href="css/bootstrap.css" />
</head>
<body>
<%!
public List<Pet> getPageList(List<Pet> list, Integer pageNum, Integer pageSize) {
    if (list == null) {
        return null;
    }
    if (list.size() == 0) {
        return null;
    }

    Integer count = list.size(); // 记录总数
    Integer pageCount = 0; // 页数,一共多少页

    if (count % pageSize == 0) {//取余计算总页数
        pageCount = count / pageSize;
    } else {
        pageCount = count / pageSize + 1;
    }

    int fromIndex = 0; // 开始索引
    int toIndex = 0; // 结束索引

    if (!pageNum.equals(pageCount) ) {
        fromIndex = (pageNum - 1) * pageSize; //从第几个数据开始查
        toIndex = fromIndex + pageSize;
    } else {
        fromIndex = (pageNum - 1) * pageSize;
        toIndex = count;
    }

    List<Pet> pageList = list.subList(fromIndex, toIndex);
	System.out.print("pagellist");
	System.out.print(pageList);
    return pageList;
}

%>	
	<%	
		if(application.getAttribute("allshop")!=null){
			int pn=1;
			int ps=2;
			if(request.getParameter("pn")!=null){
				pn=Integer.parseInt(request.getParameter("pn"));
				if(pn<=0)
					pn=1;
				
			}
			request.setAttribute("pn", pn);
			if(request.getParameter("ps")!=null){
				ps=Integer.parseInt(request.getParameter("ps"));
				if(ps<=0)
					pn=2;
				
			}
			request.setAttribute("ps", ps);
			List<Pet> allshop1=getPageList((List<Pet>)application.getAttribute("allshop"), pn, ps); 
			request.setAttribute("allshop1", allshop1);
		}
	%>
	
	<div class="x-nav">
		<span class="layui-breadcrumb"> <a><cite>首页</cite></a> <a><cite>订单管理</cite></a>
			<a><cite>订单列表</cite></a>
		</span> <a class="layui-btn layui-btn-small"
			style="line-height: 1.6em; margin-top: 3px; float: right"
			href="javascript:location.replace(location.href);" title="刷新"><i
			class="layui-icon" style="line-height: 30px">ဂ</i></a>
	</div>
	<c:set var="count" value="0"></c:set>
	<c:forEach items="${allshop}" var="pet" varStatus="status">
			<c:set var="count" value="${count+1 }"></c:set>
		</c:forEach>
		
	<div class="x-body">
		<xblock>
		<c:if test="${count/2!=0 }"><%Object i=pageContext.getAttribute("count");
			Integer j=0;
			if(i!=null){
					j=Integer.parseInt(i.toString());
					int allcount=j/2+1;
					pageContext.setAttribute("allcount", allcount);
			}
			
		%></c:if>
		<c:if test="${count/2==0 }"><c:set var="allcount" value="${count/2 }"></c:set></c:if>
		<c:if test="${pn!=1 }">
			<button class="layui-btn">
				<a href="log-list.jsp?pn=1" style="color: white;">第一页</a>
			</button>
			<button class="layui-btn">
				<a href="log-list.jsp?pn=${pn-1 }" style="color: white;">上一页</a>
			</button>
			
		</c:if><span>总共${allcount }页</span>  <c:if test="${pn!=allcount }">
			<button class="layui-btn">
				<a href="log-list.jsp?pn=${pn+1 }" style="color: white;">下一页</a>
			</button>
			<button class="layui-btn">
				<a href="log-list.jsp?pn=${allcount}" style="color: white;">最后一页</a>
			</button>
			<script>
				function a(ps2){
					var index=ps2.selectedIndex;
					var p=ps2[index].value;
					window.location.href="log-list.jsp?pn="+p;
				}
			</script>
		</c:if>
		<form action="log-list.jsp" method="get" style="display: inline;">
	    	<select name="pn" onchange="a(this)" style="width: 100px">
	    		<c:forEach begin="1" end="${allcount }" step="1" var="i">
	    			<option value='${i }' <c:if test='${pn==i }'>selected</c:if> >${i }</option>
	    		</c:forEach>
	    	</select>
	    	<input type="submit" value="跳转到"  class="layui-btn">
	    	</form>
		</ul>
		
		<span class="x-right" style="line-height: 40px">共有数据：<span
			class="layui-badge">${count}</span>条
		</span></xblock>
		<table class="layui-table">
			<thead>
				<tr>
					<th>ID</th>
					<th>性别</th>
					<th>名字</th>
					<th>年龄</th>
					<th>类型</th>
					<th>尺寸</th>
					<th>价格</th>
					<th>颜色</th>
					<th>图片<!--四张图片可以滑动的效果-->
					</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				<c:forEach items="${allshop1}" var="pet" varStatus="status">
					<tr>
						<td>${pet.id}</td>
						<td>${pet.sex }</td>
						<td>${pet.title }</td>
						<td>${pet.age }</td>
						<td>${pet.classes }</td>
						<td>${pet.size }</td>
						<td>${pet.price }</td>
						<td>${pet.color }</td>
						<td class="td-status">
								<div id="slideBox" class="slideBox" style="width: 200px;">
									<div class="bd">
										<ul>
										<c:if test="${pet.pics1!=''}">
											<li><a href="javascript:;"><img
													src="upload/${pet.pics1 }"  style="width: 100px;" /></a></li>
										</c:if>
										<c:if test="${pet.pics2!=''}">			
											<li><a href="javascript:;"><img
													src="upload/${pet.pics2 }"  style="width: 100px;" /></a></li>
										</c:if>
										<c:if test="${pet.pics3!=''}">			
											<li><a href="javascript:;"><img
													src="upload/${pet.pics3 }"  style="width: 100px;" /></a></li>
													</c:if>
										<c:if test="${pet.pics4!=''}">
											<li><a href="javascript:;"><img src="upload/${pet.pics4 }"  style="width: 100px;" /></a></li>
											</c:if>
										
										<c:if test="${pet.pics5!=''}">
											<li><a href="javascript:;"><img
													src="upload/${pet.pics5 }"  style="width: 100px;" /></a></li>
										</c:if>		
										</ul>
									</div>
								</div>
						</td>
						<td class="td-manage"></td>
					</tr>
				</c:forEach>
			</tbody>
		</table>

	</div>
	<script src="./lib/layui/layui.js" charset="utf-8"></script>
	<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
	<script type="text/javascript" src="js/jquery.SuperSlide.js"></script>
	<script src="./js/x-layui.js" charset="utf-8"></script>
	<script>
		layui.use([ 'laydate', 'element', 'laypage', 'layer' ], function() {
			$ = layui.jquery;//jquery
			laydate = layui.laydate;//日期插件
			lement = layui.element();//面包导航
			laypage = layui.laypage;//分页
			layer = layui.layer;//弹出层

			//以上模块根据需要引入

			laypage({
				cont : 'page',
				pages : 100,
				first : 1,
				last : 100,
				prev : '<em><</em>',
				next : '<em>></em>'
			});

			var start = {
				min : laydate.now(),
				max : '2099-06-16 23:59:59',
				istoday : false,
				choose : function(datas) {
					end.min = datas; //开始日选好后，重置结束日的最小日期
					end.start = datas //将结束日的初始值设定为开始日
				}
			};

			var end = {
				min : laydate.now(),
				max : '2099-06-16 23:59:59',
				istoday : false,
				choose : function(datas) {
					start.max = datas; //结束日选好后，重置开始日的最大日期
				}
			};

			document.getElementById('LAY_demorange_s').onclick = function() {
				start.elem = this;
				laydate(start);
			}
			document.getElementById('LAY_demorange_e').onclick = function() {
				end.elem = this
				laydate(end);
			}

		});

		//批量删除提交
		function delAll() {
			layer.confirm('确认要删除吗？', {
				icon : 3,
				title : '提示信息'
			}, function(index) {
				//捉到所有被选中的，发异步进行删除
				layer.msg('删除成功', {
					icon : 1
				});
				//          后端完成
			});
		}

		/*用户-删除*/
		function member_del(obj, id) {
			        layer.confirm('确认要删除吗？',{icon:3,title:'提示信息'},function(index){
			          	$(obj).parents("tr").remove();
			          	layer.msg('删除成功！',{icon:1,time:1000});
			          	setInterval(function () {
			          		window.location.href="petdel.do?id="+id;
						}, 500);
			        });
		}
		function member_edit(title, url, id) {
			url = url + "?id=" + id;
			x_admin_show(title, url);
		}
		jQuery(".slideBox").slide({
			mainCell : ".bd ul",
			effect : "fold",
			autoPlay : true,
			trigger : "click"
		});
		jQuery(function() {
			var len = jQuery(".hd ul").find("li").length;
			var width = len * 20 - 10;
			jQuery(".hd").css("width", width + "px").css("margin-left",
					"-" + width / 2 + "px");
			jQuery(".hd").find('li').last().css("margin", "0px");
			jQuery(".bd img").css("position", "absolute").css("left", "50%")
					.css("transform", "translate(-50%)");
			jQuery(".hd ul").find('li').eq('@index').click();
		})

		// 切换图片
		jQuery('.switch').click(function(e) {
			var index = $(".hd li").index($(".hd .on").eq(0));
			var width = $(this).width();
			var positionX = e.pageX - $(this).offset().left; //获取当前鼠标相对div的X坐标
			if (positionX < width / 2) {
				// 上一张
				index -= 1;
				if (index >= 0) {
					jQuery(".hd ul").find("li").eq(index).click();
				}
			} else {
				// 下一张
				index += 1;
				var len = jQuery(".hd ul").find("li").length;
				if (index <= len - 1) {
					jQuery(".hd ul").find("li").eq(index).click();
				}
			}
		})
	</script>

</body>
</html>